<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  <title>首页</title>
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"/>
  <link rel="stylesheet" href="/AdminLTE-2.3.11/bootstrap/css/bootstrap.min.css"/>
  <link rel="stylesheet" href="/bootstrap-table/src/bootstrap-table.css"/>
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css"/>
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css"/>
  <!-- Theme style -->
  <link rel="stylesheet" href="/AdminLTE-2.3.11/dist/css/AdminLTE.min.css"/>
  <!-- AdminLTE Skins. We have chosen the skin-blue for this starter
        page. However, you can choose any other skin. Make sure you
        apply the skin class to the body tag so the changes take effect.
  -->
  <link rel="stylesheet" href="/AdminLTE-2.3.11/dist/css/skins/skin-blue.min.css"/>

  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body class="hold-transition skin-blue">
<div class="wrapper">

  <!-- Main Header -->
  <header class="main-header">

    <!-- Logo -->
    <a href="#" class="logo">
      <span class="logo-lg"><b>东溪</b>励氏族谱</span>
    </a>

    <!-- Header Navbar -->
    <nav class="navbar navbar-static-top" role="navigation">
      <!-- Sidebar toggle button-->
      <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
        <span class="sr-only">Toggle navigation</span>
      </a>
    </nav>
  </header>
  <!-- Left side column. contains the logo and sidebar -->
  <aside class="main-sidebar">

    <!-- sidebar: style can be found in sidebar.less -->
    <section class="sidebar">

      <!-- Sidebar user panel (optional) -->
      <div class="user-panel">
        <div class="pull-left image">
          <img src="/AdminLTE-2.3.11/dist/img/user2-160x160.jpg" class="img-circle" alt="User Image"/>
        </div>
        <div class="pull-left info">
          <p>后台管理员</p>
          <!-- Status -->
          <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
        </div>
      </div>

      <ul class="sidebar-menu">
        <li class="header">菜单</li>
        <!-- Optionally, you can add icons to the links -->
        <li class="treeview">
          <a href="#"><i class="fa fa-link"></i> <span>族谱搜索</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="/sys/index">族谱树</a></li>
            <li><a href="/sys/zpSearch">成员搜索</a></li>
          </ul>
        </li>
        <li class="treeview active">
          <a href="#"><i class="fa fa-link"></i> <span>族谱成员管理</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="/sys/addData">成员录入</a></li>
            <li><a href="/sys/update">成员更新</a></li>
            <li><a href="/sys/delete">成员删除</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#"><i class="fa fa-link"></i> <span>族谱信息统计</span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="/sys/stat">按世代统计人口数</a></li>
          </ul>
        </li>
        <li><a href="/"><i class="fa fa-link"></i> <span>图说东溪</span></a></li>
      </ul>
      <!-- /.sidebar-menu -->
    </section>
    <!-- /.sidebar -->
  </aside>

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        数据录入
      </h1>
    </section>

    <!-- Main content -->
    <section class="content">

      <div class="box">
        <div class="box-body">
            <div class="input-group">
              <table>
                <tr>
                  <td><label class="form-label">输入查询谱名：</label></td>
                  <td><input id="pname" type="text" class="form-control"/></td>
                  <td>
                    &nbsp; &nbsp; &nbsp; &nbsp;
                    <button onclick="search();">搜索</button>
                  </td>
                </tr>
              </table>
            </div>
          <label style="color: red">查询结果：</label>
          <table id="table"
                 data-toggle="table"
                 data-height="180"
                 data-side-pagination="server"
                 data-pagination="true"
                 data-page-list="[5, 10]">
            <thead>
            <tr>
              <th data-field="id" data-visible="false">ID</th>
              <th data-field="name">谱名</th>
              <th data-field="rname">乳名</th>
              <th data-field="idname">身份证姓名</th>
              <th data-field="pid" data-visible="false">父节点id</th>
              <th data-field="rank" data-visible="false">家中第几子</th>
              <th data-field="gene" data-visible="false">代数</th>
              <th data-field="csrq" data-visible="false">出生日期</th>
              <th data-field="swrq" data-visible="false">死亡日期</th>
              <th data-field="wife" data-visible="false">妻子</th>
              <th data-field="wcsrq" data-visible="false">妻子出生日期</th>
              <th data-field="wswrq" data-visible="false">妻子死亡日期</th>
              <th data-field="wintr" data-visible="false">妻子介绍</th>
              <th data-field="addr" data-visible="false">家庭地址</th>
              <th data-field="intr" data-visible="false">个人简介（族谱介绍）</th>
              <th data-field="zi" data-visible="false">字</th>
              <th data-field="gi" data-visible="false">是否过继</th>
              <th data-field="dwife" data-visible="false">是否多妻</th>
              <th data-field="edu" data-visible="false">学历</th>
              <th data-field="school" data-visible="false">学校</th>
              <th data-field="hao" data-visible="false">号</th>
            </tr>
            </thead>
          </table>
          <hr style="margin: 10px"/>
          <label style="color: red">成员基本信息：</label>
          <div class="row">
            <div class="col-md-1">
              <label class="form-control">谱名:</label>
            </div>
            <div class="col-md-1">
              <input id="name" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label class="form-control">父id:</label>
            </div>
            <div class="col-md-1">
              <input id="pid" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label class="form-control">字:</label>
            </div>
            <div class="col-md-1">
              <input id="zi" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label class="form-control">号:</label>
            </div>
            <div class="col-md-1">
              <input id="hao" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label class="form-control">排行:</label>
            </div>
            <div class="col-md-1">
              <input id="rank"  class="form-control"/>
            </div>
            <div class="col-md-1">
              <label class="form-control">世代:</label>
            </div>
            <div class="col-md-1">
              <input id="gene" class="form-control"/>
            </div>
          </div>
          <div class="row">
            <div class="col-md-2"><label class="form-control text-center">个人介绍:</label></div>
            <div class="col-md-9"><textarea id="intr" class="form-control"></textarea></div>
          </div>
          <hr style="margin: 10px"/>
          <label style="color: red">成员其他信息：</label>
          <div class="row">
            <div class="col-md-2">
              <input type="hidden" id="id"/>
              <label class="form-control text-center">身份证姓名:</label>
            </div>
            <div class="col-md-2">
              <input id="idname" class="form-control"/>
            </div>
            <div class="col-md-2">
              <label class="form-control text-center">乳名:</label>
            </div>
            <div class="col-md-2">
              <input id="rname" class="form-control"/>
            </div>
          </div>
          <div class="row">
            <div class="col-md-2">
              <label class="form-control text-center">出生日期:</label>
            </div>
            <div class="col-md-2">
              <input id="csrq" class="form-control"/>
            </div>
            <div class="col-md-2">
              <label class="form-control text-center">死亡日期:</label>
            </div>
            <div class="col-md-2">
              <input id="swrq" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label class="form-control">住所:</label>
            </div>
            <div class="col-md-2">
              <input id="addr" class="form-control"/>
            </div>
          </div>
          <div class="row">
            <div class="col-md-2">
              <label class="form-control text-center">联系方式:</label>
            </div>
            <div class="col-md-2">
              <input id="lxfs" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label  class="form-control text-center">学历:</label>
            </div>
            <div class="col-md-1">
              <input id="edu" class="form-control"/>
            </div>
            <div class="col-md-1">
              <label  class="form-control">职称:</label>
            </div>
            <div class="col-md-1">
              <input id="title" class="form-control"/>
            </div>
            <div class="col-md-2">
              <label class="form-control text-center">毕业院校:</label>
            </div>
            <div class="col-md-1">
              <input id="school" class="form-control"/>
            </div>
          </div>
          <hr style="margin: 10px"/>
          <label style="color: red">妻子基本信息：</label>
          <div class="row">
            <div class="col-md-1">
              <label class="form-control">姓名:</label>
            </div>
            <div class="col-md-1">
              <input id="wife" class="form-control"/>
            </div>
            <div class="col-md-2">
              <label class="form-control text-center">出生日期:</label>
            </div>
            <div class="col-md-2">
              <input id="wcsrq" class="form-control"/>
            </div>
            <div class="col-md-2">
              <label class="form-control text-center">死亡日期:</label>
            </div>
            <div class="col-md-2">
              <input id="wswrq" class="form-control"/>
            </div>
          </div>
          <div class="row">
            <div class="col-md-2"><label class="form-control text-center">妻子介绍:</label></div>
            <div class="col-md-9"><textarea id="wintr" class="form-control"></textarea></div>
          </div>
        </div>
        <hr style="margin: 10px"/>
        <label style="color: red">个人其他信息：</label>
        <div class="row">
          <label class="col-md-2 text-center">是否多妻？</label>
          <label class="radio-inline">
            <input type="radio" name="sfdq" value="yes"/> yes
          </label>
          <label class="radio-inline">
            <input type="radio" name="sfdq" value="no"/> no
          </label>
        </div>
        <div class="row">
          <label class="col-md-2 text-center">是否过继？</label>
          <label class="radio-inline">
            <input type="radio" name="sfgj" value="yes"/> yes
          </label>
          <label class="radio-inline">
            <input type="radio" name="sfgj" value="no"/> no
          </label>
        </div>
      </div>
      <button class="btn btn-block btn-success btn-lg" onclick="submitData()">提交</button>

    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

  <!-- Main Footer -->
  <footer class="main-footer">
    <!-- To the right -->
    <div class="pull-right hidden-xs">
      东溪励式族谱
    </div>
    <!-- Default to the left -->
    <strong>Copyright &copy; <a href="/">图说东溪</a>.</strong>
  </footer>

  <!-- Control Sidebar -->
  <!-- /.control-sidebar -->
  <!-- Add the sidebar's background. This div must be placed
       immediately after the control sidebar -->
  <div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper -->

<!-- REQUIRED JS SCRIPTS -->

<!-- jQuery 2.2.3 -->
<script src="/AdminLTE-2.3.11/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="/AdminLTE-2.3.11/bootstrap/js/bootstrap.min.js"></script>
<script src="/bootstrap-table/src/bootstrap-table.js"></script>
<script src="/bootstrap-table/src/locale/bootstrap-table-zh-CN.js"></script>
<!-- AdminLTE App -->
<script src="/AdminLTE-2.3.11/dist/js/app.min.js"></script>
<script>
  var $table=$("#table");
  $table.on("click-row.bs.table",function ($element,row) {
      console.log(row)
      $("#id").val(row["id"])
      $("#name").val(row["name"])
      $("#pid").val(row["pid"])
      $("#zi").val(row["zi"])
      $("#hao").val(row["hao"])
      $("#rank").val(row["rank"])
      $("#gene").val(row["gene"])
      $("#intr").val(row["intr"])

      //没有职称
      $("#idname").val(row["idname"])
      $("#rname").val(row["rname"])
      $("#csrq").val(row["csrq"])
      $("#swrq").val(row["swrq"])
      $("#lxfs").val(row["lxfs"])
      $("#edu").val(row["edu"])
      $("#school").val(row["school"])
      $("#addr").val(row["addr"])

      $("#wife").val(row["wife"])
      $("#wcsrq").val(row["wcsrq"])
      $("#wswrq").val(row["wswrq"])
      $("#wintr").val(row["wintr"])
      $(":radio[name='sfdq'][value='" + row["dwife"] + "']").prop("checked", "checked");
      $(":radio[name='sfgj'][value='" + row["gi"] + "']").prop("checked", "checked");
  })
  function search() {
      var name = $("#pname").val();
      if (name == "") {
          alert("请输入查询的名称！")
          return;
      } else {
          $.post("/search/personFromName", {
              name: name,
          }, function (data) {
              if (data.total == 0) {
                  alert("没有查询到结果")
              }
              else {
                  console.log(data)
                  alert("查询成功")
                  $table.bootstrapTable('load', data)


              }
          })
      }
  }
  function submitData() {
      var id=$("#id").val()
      var name=$("#name").val()
      var pid=$("#pid").val()
      var zi=$("#zi").val()
      var hao=$("#hao").val()
      var rank=$("#rank").val()
      var gene=$("#gene").val()
      var intr=$("#intr").val()

      //没有职称
      var idname=$("#idname").val()
      var rname=$("#rname").val()
      var csrq=$("#csrq").val()
      var swrq=$("#swrq").val()
      var lxfs=$("#lxfs").val()
      var edu=$("#edu").val()
      var school=$("#school").val()
      var addr=$("#addr").val()

      var wife=$("#wife").val()
      var wcsrq=$("#wcsrq").val()
      var wswrq=$("#wswrq").val()
      var wintr=$("#wintr").val()

      var dwife = $('input[name="sfdq"]:checked').val();
      var gi = $('input[name="sfgj"]:checked').val();

      $.post("/zp/updateZP",{
          "id":id,
          "name":name,
          "pid":pid,
          "zi":zi,
          "hao":hao,
          "rank":rank,
          "gene":gene,
          "intr":intr,
          "idname":idname,
          "rname":rname,
          "csrq":csrq,
          "swrq":swrq,
          "lxfs":lxfs,
          "edu":edu,
          "addr":addr,
          "school":school,
          "wife":wife,
          "wcsrq":wcsrq,
          "wswrq":wswrq,
          "wintr":wintr,
          "dwife":dwife,
          "gi":gi
      },function (data) {
        alert("更新成功！");
        window.location="/sys/index"
          
      })
  }
</script>
<!-- Optionally, you can add Slimscroll and FastClick plugins.
     Both of these plugins are recommended to enhance the
     user experience. Slimscroll is required when using the
     fixed layout. -->
</body>
</html>
